@import '../../themes/vars.less';
.combined-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0;
  background: linear-gradient(180deg, #f1f2f5, fade(@primary-color, 45%) 100%);
  :global {
    .combined {
      position: relative;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      width: 450px;
      height: 220px;
      margin: auto;
      color: #002e52;
    }
    .combined-shape {
      position: relative;
    }
    .combined-shape > * {
      position: absolute;
      width: 50%;
      height: 78px;
      overflow: hidden;
    }
    .combined-shape > * > * {
      width: 100%;
      height: 100%;
      background: fade(@primary-color, 40%);
    }
    .combined-shape .shape-left {
      left: 0;
      border-radius: 36px 0 0 36px;
    }
    .combined-shape .shape-right {
      right: 0;
      border-radius: 0 36px 36px 0;
    }
    .combined .title {
      position: absolute;
      width: 600px;
      overflow: hidden;
      font-weight: 700;
      font-size: 60px;
      letter-spacing: 6px;
      white-space: nowrap;
    }
    .combined-bar {
      position: absolute;
      top: 86px;
      width: 480px;
      height: 2px;
      background: #002e52;
    }
    .combined .content {
      position: absolute;
      top: 92px;
      width: 100%;
      font-size: 22px;
      text-align: center;
    }
  }
}
